<div class="bf-roombind">
  <!--确认弹窗-->
  <p-confirmDialog acceptLabel="确认" rejectLabel="取消"></p-confirmDialog>
  <!--消息提示-->
  <p-messages  [closable]="true" [style]="{'position':'fixed','left': '10vw', 'top': '0','margin-top': '0','width': '100vw','z-index':'9999'}"></p-messages>
  <!--顶部按钮-->
  <div class="bf-roombind-header">
    <div class=" ui-g-12">
      <div class="ui-g-1 bf-roombind-header-btn bf-roombind-header-btn-add" (click)="roombindAddClick()" [hidden]="this.btnHiden[0].hidden">
        <img class="bf-roombind-header-img-add" src="assets/images/ic_add.png" alt="">
        <span>增 加</span>
      </div>
      <div class="ui-g-1 bf-roombind-header-btn bf-roombind-header-btn-modify" (click)="roombindModifyClick()" [hidden]="this.btnHiden[1].hidden">
        <img class="bf-roombind-header-img-modify" src="assets/images/ic_modify.png" alt="">
        <span>修 改</span>
      </div>
      <div class="ui-g-1 bf-roombind-header-btn bf-roombind-header-btn-delete" (click)="roombindDeleteClick()" [hidden]="this.btnHiden[2].hidden">
        <img class="bf-roombind-header-img-delete" src="assets/images/ic_delete.png" alt="">
        <span>删 除</span>
      </div>
    </div>
    <div class="ui-inputgroup bf-roombind-header-search">
<!--      <p-dropdown [options]="SearchTypeOption"   scrollHeight="100px" placeholder="请选查看范围..." [style]="{'width': '8vw','margin-right': '1vw'}" [(ngModel)]="searchType"></p-dropdown>-->
      <input type="text" pInputText placeholder="请输入房间号" #input  [(ngModel)]="serchData">
      <button id="disabled-btn" class="bf-roombind-header-btn-search" type="button"  (click)="roombindSearchClick()"  label="搜索">搜索</button>
    </div>
  </div>
  <!--表格-->
  <div class="bf-roombind-table">
    <rbi-check-table-btn
      [option]="tableOption"
      [select]="roombindSelect"
      (selectData)="selectData($event)">
    </rbi-check-table-btn>
  </div>
  <!--增加弹窗-->
  <p-dialog header="信息添加" [(visible)]="roombindAddDialog" [width]="800" [closable]="false">
    <!--Content-->
    <div class="ui-g ui-fluid" [ngStyle]="{'line-height':'4vh'}">
      <div class="ui-g-6" [ngClass]="{dropdownKeyFilter: this.keyRoomInfo}">
        <div class="ui-g-4" style="text-align: right">
          <label ><span style="color: red">*</span>缴费项目：</label>
        </div>
        <div class="ui-g-8" [ngStyle]="{'line-height':'2vh'}">
          <p-dropdown [options]="chargeItemOption" scrollHeight="100px" placeholder="请选择缴费项目..."  [(ngModel)]="roombindAdd.chargeCode" (onChange)="changeInput(roombindAdd.chargeCode)"></p-dropdown>
        </div>
      </div>
    </div>
    <p-footer>
      <div class="ui-dialog-buttonpane ui-helper-clearfix" style="text-align: center">
        <button class="bf-roombind-dialog-Btn bf-roombind-dialog-Btn-sure" (click)="roombindAddSureClick()">确认</button>
        <button class="bf-roombind-dialog-Btn bf-roombind-dialog-Btn-false" (click)="roombindAddDialog=false;clearData();">取消</button>
      </div>
    </p-footer>
  </p-dialog>
  <!--修改弹窗-->
  <p-dialog header="信息修改" [(visible)]="roombindModifayDialog" [width]="800" [closable]="true">
    <!--Content-->
    <div class="ui-g ui-fluid" [ngStyle]="{'line-height':'4vh'}">
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label >缴费项目：</label>
        </div>
        <div class="ui-g-8" [ngStyle]="{'line-height':'2vh'}"  style="text-align: center">
          <p-dropdown [options]="chargeItemOption" scrollHeight="100px" [placeholder]="chargeItemName"  [(ngModel)]="roombindModify.chargeCode"></p-dropdown>
        </div>
      </div>
    </div>
    <p-footer>
      <div class="ui-dialog-buttonpane ui-helper-clearfix">
        <button class="bf-roombind-dialog-Btn bf-roombind-dialog-Btn-sure" (click)="roombindModifySureClick()">确认</button>
        <button class="bf-roombind-dialog-Btn bf-roombind-dialog-Btn-false"  (click)="roombindModifayDialog=false;clearData()">取消</button>
      </div>
    </p-footer>
  </p-dialog>
  <!--详情弹窗-->
  <rbi-detail-pop [dialogOption]="detailOption"></rbi-detail-pop>
  <rbi-paging [option]="option" (pageClick)="nowpageEventHandle($event)"></rbi-paging>
</div>
